/*
* Vieb - Vim Inspired Electron Browser
* Copyright (C) 2025 Jelmer van Arnhem
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program.  If not, see <https://www.gnu.org/licenses/>.
*/
/* colors */
:root {
    /* general */
    --bg: #e6e9ef;
    --fg: #4c4f69;
    --tab-background: #dce0e8;
    --tab-suspended: #ccd0da;
    --visible-tab: #eff1f5;
    --tab-split: #1e66f5;
    --tab-audio: #179299;
    --tab-muted: #6c6f85;
    --tab-muted-playing: #ea76cb;
    --tab-crashed: #d20f39;
    --tab-scrollbar: #acb0be;
    --mode-normal-fg: var(--fg);
    --mode-normal-bg: var(--bg);
    --mode-command-fg: var(--bg);
    --mode-command-bg: #209fb5;
    --mode-insert-fg: var(--bg);
    --mode-insert-bg: #e64553;
    --mode-follow-fg: var(--bg);
    --mode-follow-bg: #df8e1d;
    --mode-explore-fg: var(--bg);
    --mode-explore-bg: #179299;
    --mode-search-fg: var(--bg);
    --mode-search-bg: #8839ef;
    --mode-pointer-fg: var(--bg);
    --mode-pointer-bg: #dc8a78;
    --mode-visual-fg: var(--bg);
    --mode-visual-bg: #40a02b;
    --url-default: #179299;
    --url-search: #179299;
    --url-searchwords: #179299;
    --url-url: #179299;
    --url-suggest: #179299;
    --url-file: #179299;
    --url-invalid: #179299;
    --suggestions-border: #e6e9ef;
    --suggestions-bg: #e6e9ef;
    --suggestions-selected: #ccd0da;
    --suggestions-searchwords: #df8e1d;
    --suggestions-url: #6c6f85;
    --suggestions-file: #6c6f85;
    --notification-border: var(--bg);
    --notification-date: #6c6f85;
    --notification-permission: #6c6f85;
    --notification-error: #d20f39;
    --notification-warning: #df8e1d;
    --notification-info: #04a5e5;
    --notification-success: #40a02b;
    --url-hover-fg: #5c5f77;
    --url-hover-bg: #ccd0da;
    --screenshot-highlight: #ea76cb;
    --screenshot-highlight-background: #ea76cb;
    /* special pages */
    --link-color: #8839ef;
    --link-underline: none;
    --scrollbar-bg: #ccd0da;
    --scrollbar-thumb: #bcc0cc;
    --button-disabled: #bcc0cc;
    --code-fg: #dc8a78;
    --code-bg: #e6e9ef;
    --code-command: #dd7878;
    --placeholder-text: #6c6f85;
    --special-page-element-bg: #ccd0da;
    --special-page-element-border: #ccd0da;
    --input-unfocused: #ccd0da;
    --input-focused: #acb0be;
    --download-progress-fg: #acb0be;
    --download-progress-bg: #ccd0da;
    --helppage-h1: var(--fg);
    --helppage-h2: var(--fg);
    --helppage-h3: var(--fg);
    --helppage-countable: #df8e1d;
    --helppage-range-compat: #df8e1d;
    --helppage-nativetheme-fg-light: #5c5f77;
    --helppage-nativetheme-bg-light: #eff1f5;
    --helppage-nativetheme-fg-dark: #5c5f77;
    --helppage-nativetheme-bg-dark: #eff1f5;
    /* sourceviewer */
    --syntax-keyword: #d20f39;
    --syntax-entity: #40a02b;
    --syntax-constant: #179299;
    --syntax-string: #04a5e5;
    --syntax-variable: #e64553;
    --syntax-comment: #6c6f85;
    --syntax-entity-tag: #8839ef;
    --syntax-markup-heading: #40a02b;
    --syntax-markup-list: #ea76cb;
    --syntax-markup-emphasis: #179299;
    --syntax-markup-addition-fg: #8839ef;
    --syntax-markup-addition-bg: #e6e9ef;
    --syntax-markup-deletion-fg: #dd7878;
    --syntax-markup-deletion-bg: #d20f39;
    /* follow links */
    --follow-text: var(--bg);
    --follow-url-bg: #fe640b;
    --follow-url-border: #fe640b66;
    --follow-url-hover: #fe640b66;
    --follow-click-bg: #04a5e5;
    --follow-click-border: #04a5e566;
    --follow-click-hover: #04a5e566;
    --follow-insert-bg: #e64553;
    --follow-insert-border: #e6455366;
    --follow-insert-hover: #e6455366;
    --follow-onclick-bg: #8839ef;
    --follow-onclick-border:#8839ef66;
    --follow-onclick-hover: #8839ef66;
    --follow-media-bg: #40a02b;
    --follow-media-border: #40a02b66;
    --follow-media-hover: #40a02b66;
    --follow-image-bg: #df8e1d;
    --follow-image-border: #df8e1d66;
    --follow-image-hover: #df8e1d66;
    --follow-other-bg: #4c4f69;
    --follow-other-border: #4c4f6966;
    --follow-other-hover: #4c4f6966;
}

/* navbar & tabs */
#tabs, #navbar {counter-reset: tab-counter -1;position: relative;}
#mode-container {width: 2.8em;height: 2.8em;margin: 0;align-items: center;font-weight: normal;position: relative;}
#logo {margin: .5em;}
#mode {display: none;}
/* modes */
#mode-container::before {background-size: 1.5em;background-position: center;height: 1.8em;width: 1.8em;margin: .5em;filter: invert(1);}
[current-mode=command] #mode-container::before {content: url("");}
[current-mode=insert] #mode-container::before {content: url("");}
[current-mode=normal] #mode-container::before {filter: invert(.4);content: url("");}
[current-mode=follow] #mode-container::before {content: url("");}
[current-mode=explore] #mode-container::before {content: url("");}
[current-mode=search] #mode-container::before {content: url("");}
[current-mode=pointer] #mode-container::before {content: url("");}
[current-mode=visual] #mode-container::before {content: url("");}
/* tabs */
#tabs .status {filter: invert(.4);}
#tabs > span {padding: .25em;max-width:20em;height: 2.5em;border-top: solid .1em transparent;}
#tabs > ::before {counter-increment: tab-counter 1;content: counter(tab-counter);font-size: .85em;}
#tabs > span > img {padding-right: .5em;height: 1em;width: 1em;min-height: 1em;min-width: 1em;}
#tabs .pinned {min-width: 3em !important;max-width: 3em;width: 3em;padding: .25em;}
#tabs .pinned > img {margin: auto;height: 1.2em;width: 1.2em;min-height: 1.2em;min-width: 1.2em;}
#tabs .pinned > span {display: none;}
/* Nav url/search/command */
#url {border: 0;}
#navbar:has(#url)::before {z-index: 1;position: absolute;left: 2.8em;box-sizing: border-box;padding: .5em;display: none;width: 2.8em;height: 100%;top: 0;background: var(--url-default);color: var(--tab-background);pointer-events: none;content: url("");filter: invert(1);}
#navbar:has(#url.search)::before {display: block;background: var(--url-search);content: url("");}
#navbar:has(#url.searchwords)::before {display: block;background: var(--url-searchwords);content: url("");}
#navbar:has(#url.url)::before {display: block;background: var(--url-url);content: url("");}
#navbar:has(#url.suggest)::before {display: block;background: var(--url-suggest);content: url("");}
#navbar:has(#url.file)::before {display: block;background: var(--url-file);content: url("");}
#navbar:has(#url.invalid)::before {display: block;background: var(--url-invalid);content: url("");}
/* mouse related */
#mode-suggestions {left: 0;top: 2.8em;}
#url-hover {margin: 0;}
/* special pages */
#app #pointer, #cookiespage img, #downloadspage img, #historypage img {filter: invert(1);}
.specialpage a::after {filter: invert(1);}
#helppage .cheatsheet {filter: none;}
#historypage img.favicon {filter: none;}
